<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>

<pre id="console"></pre>
<canvas id="c" width="100" height="50"></canvas>

<script>
// Tests that using the different composite modes to fill large rects doesn't crash and works as expected.
var canvas = document.getElementById("c");
var ctx = canvas.getContext("2d");

function clearContextToGreen() {
    ctx.globalCompositeOperation="source-over";
    ctx.fillStyle = "rgb(0, 255, 0)";
    ctx.fillRect(0, 0, canvas.width, canvas.height);
}

var testScenarios = [
    ['Test source-over', 'source-over', [0, 0, 255]],
    ['Test source-in', 'source-in', [0, 0, 255]],
    ['Test source-out', 'source-out', [0, 0, 0]],
    ['Test source-atop', 'source-atop', [0, 0, 255]],
    ['Test destination-over', 'destination-over', [0, 255, 0]],
    ['Test destiation-in', 'destination-in', [0, 255, 0]],
    ['Test destination-out', 'destination-out', [0, 0, 0]],
    ['Test destination-atop', 'destination-atop', [0, 255, 0]],
    ['Test lighter', 'lighter', [0, 255, 255]],
    ['Test copy', 'copy', [0, 0, 255]],
    ['Test xor', 'xor', [0, 0, 0]]
];

var fillSize = 0;
function testLargeRect(compositeMode, expected) {
    clearContextToGreen();
    ctx.fillStyle = "rgb(0, 0, 255)";
    ctx.globalCompositeOperation = compositeMode;
    ctx.fillRect(0, 0, fillSize, fillSize);

    var data = ctx.getImageData(0, 0, canvas.width, canvas.height).data;
    var testPassed = true;
    for (var i = 0; i < 3; i++)
        if (data[i] != expected[i])
            testPassed = false;
    assert_true(testPassed);
}

[10000, 50000, 100000].forEach(function(fillSizeItem) {
    fillSize = fillSizeItem;
    generate_tests(testLargeRect, testScenarios);
});

</script>
